
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="A layout example that shows off a blog page with a list of posts.">
    <title>Blog &ndash; Layout Examples &ndash; Pure</title>
    <link rel="stylesheet" href="pure-min.css">
    <link rel="stylesheet" href="grids-responsive-min.css">
    <link rel="stylesheet" href="styles.css">
    
    
      <link rel="stylesheet" type="text/css" href="saliya/waifu.min.css?v=1.4.2"/>
    
    <style type="text/css">
	    #live2dcanvas {
		    border: 0 !important;
		}
    </style>
    
    
</head>
<body>

<div id="layout" class="pure-g">
    <div class="sidebar pure-u-1 pure-u-md-1-4">
        <div class="header">
        	<h1 class='brand-title' id = "name">500:未知</h1>
            <h2 class="brand-tagline" id = "motto">一切皆有命，万事不强求</h2>

            <nav class="nav">
                <ul class="nav-list" id = "friend_chain">
                </ul>
            </nav>
        </div>
    </div>

    <div class="content pure-u-1 pure-u-md-3-4">
        <div>
            <!-- A wrapper for all the blog posts -->
            <div class="posts">
                <h1 class="content-subhead">置顶</h1>

                <!-- A single blog post -->
                <section class="post">
                    <header class="post-header">
<!--                         <img width="48" height="48" alt="Tilo Mitra&#x27;s avatar" class="post-avatar" src="/img/common/tilo-avatar.png"> -->

                        <h2 class="post-title" id="zdH2">Introducing Pure</h2>

                        <p class="post-meta" id="group">
                        </p>
                    </header>

                    <div class="post-description" id="zdCOde">
                        
                    </div>
                </section>
            </div>

            <div class="posts">
                <h1 class="content-subhead" id="zj">最近</h1>

<!--                 <section class="post" > -->
<!--                     <header class="post-header"> -->
<!--                         <img width="48" height="48" alt="Eric Ferraiuolo&#x27;s avatar" class="post-avatar" src="/img/common/ericf-avatar.png"> -->

<!--                         <h2 class="post-title" id="zjH2">Everything You Need to Know About Grunt</h2> -->

<!--                         <p class="post-meta"> -->
<!--                             By <a class="post-author" href="#">Eric Ferraiuolo</a> under <a class="post-category post-category-js" href="#">JavaScript</a> -->
<!--                         </p> -->
<!--                     </header> -->

<!--                     <div class="post-description" id="zjcode"> -->
<!--                     </div> -->
<!--                 </section> -->

<!--                 <section class="post"> -->
<!--                     <header class="post-header"> -->
<!--                         <img width="48" height="48" alt="Reid Burke&#x27;s avatar" class="post-avatar" src="/img/common/reid-avatar.png"> -->

<!--                         <h2 class="post-title">Photos from CSSConf and JSConf</h2> -->

<!--                         <p class="post-meta"> -->
<!--                             By <a class="post-author" href="#">Reid Burke</a> under <a class="post-category" href="#">Uncategorized</a> -->
<!--                         </p> -->
<!--                     </header> -->

<!--                     <div class="post-description"> -->
<!--                         <div class="post-images pure-g"> -->
<!--                             <div class="pure-u-1 pure-u-md-1-2"> -->
<!--                                 <a href="http://www.flickr.com/photos/uberlife/8915936174/"> -->
<!--                                     <img alt="Photo of someone working poolside at a resort" -->
<!--                                          class="pure-img-responsive" -->
<!--                                          src="http://farm8.staticflickr.com/7448/8915936174_8d54ec76c6.jpg"> -->
<!--                                 </a> -->

<!--                                 <div class="post-image-meta"> -->
<!--                                     <h3>CSSConf Photos</h3> -->
<!--                                 </div> -->
<!--                             </div> -->

<!--                             <div class="pure-u-1 pure-u-md-1-2"> -->
<!--                                 <a href="http://www.flickr.com/photos/uberlife/8907351301/"> -->
<!--                                     <img alt="Photo of the sunset on the beach" -->
<!--                                          class="pure-img-responsive" -->
<!--                                          src="http://farm8.staticflickr.com/7382/8907351301_bd7460cffb.jpg"> -->
<!--                                 </a> -->

<!--                                 <div class="post-image-meta"> -->
<!--                                     <h3>JSConf Photos</h3> -->
<!--                                 </div> -->
<!--                             </div> -->
<!--                         </div> -->
<!--                     </div> -->
<!--                 </section> -->

<!--                 <section class="post"> -->
<!--                     <header class="post-header"> -->
<!--                         <img width="48" height="48" alt="Andrew Wooldridge&#x27;s avatar" class="post-avatar" src="/img/common/andrew-avatar.png"> -->

<!--                         <h2 class="post-title">YUI 3.10.2 Released</h2> -->

<!--                         <p class="post-meta"> -->
<!--                             By <a class="post-author" href="#">Andrew Wooldridge</a> under <a class="post-category post-category-yui" href="#">YUI</a> -->
<!--                         </p> -->
<!--                     </header> -->

<!--                     <div class="post-description"> -->
<!--                         <p> -->
<!--                             We are happy to announce the release of YUI 3.10.2! You can find it now on the Yahoo! CDN, download it directly, or pull it in via npm. We’ve also updated the YUI Library website with the latest documentation. -->
<!--                         </p> -->
<!--                     </div> -->
<!--                 </section> -->
            </div>

            <div class="footer">
                <div class="pure-menu pure-menu-horizontal">
                    <ul id="bottom">

                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

    <script src="./jquery.min.js"></script>
<script>
	$(document).ready(function(){
		  $.get("/former/queryData",function(data,status){
// 		    alert("数据: " + data + "\n状态: " + status);
// 		    alert(data.Bloggers[0].pseudonym)
// 		    var queryUser ="<h1 class='brand-title'>"+data.Bloggers[0].pseudonym+"</h1>"
// 		    $("name").html(queryUser);
			let query = data.Bloggers;
			let core = data.Title;
			let bottomData = data.thebottomlink;


			$("#name").html(query[0].pseudonym);
			$("#motto").html(query[0].motto);
			if(query[0].friend_chain.indexOf(",") !== -1){
				let lis = '';
				for(let i=0; i< query[0].friend_chain.split(",").length; i++){
					let lisdata = query[0].friend_chain.split(",")[i].split(";");
					lis += "<li class='nav-item'><a class='pure-button' href='"+lisdata[1]+"'>"+lisdata[0]+"</a></li>&nbsp";
				}
				$("#friend_chain").append(lis);
			}
	        


			
			for(let i=0; i<core.length; i++){
				if(core[i].level == 0){
					$('#zdH2').html(core[i].title)
					let code = "<p>"+core[i].txt+"</p>"
					$("#zdCOde").append(code);
					// 分组
					if(core[i].groupName !== null){
						let lis = '';
						if( core[i].groupName !== null && core[i].groupName.indexOf(",") !== -1){
				           for(let j=0; j< core[i].groupName.split(",").length; j++){
								let lisdata = core[i].groupName.split(",")[j];
								lis += "<a class='post-category post-category-design' href='#'>"+lisdata+"</a>";
				           }
						}else{
							lis = "<a class='post-category post-category-design' href='#'>"+core[i].groupName+"</a>";
						}
						$("#group").append(lis);
					}
					
				}else{
					let data ="<section class='post' ><header class='post-header'><h2 class='post-title'>"+core[i].title+"</h2><p class='post-meta'>";
					// 分组
					if(core[i].groupName !== null){
						let lis = '';
						if( core[i].groupName.indexOf(",") !== -1){
				           for(let j=0; j< core[i].groupName.split(",").length; j++){
								let lisdata = core[i].groupName.split(",")[j];
								lis += "<a class='post-category post-category-js' href='#'>"+lisdata+"</a>";
				           }
						}else{
							lis = "<a class='post-category post-category-js' href='#'>"+core[i].groupName+"</a>";
						}
						data += lis;
					}
					
					data += "</p></header><div class='post-description'><p>"+core[i].txt+"</p></div></section>";
					$("#zj").append(data);
				}
			}
			// 底部链接
			let bottomHtml = "";
			for(var j=0; j<bottomData.length; j++){
				 bottomHtml +="<li class='pure-menu-item'><a href='"+bottomData[j].ljDddress+"' class='pure-menu-link'>"+bottomData[j].ljName+"</a></li>";
			}
			$("#bottom").append(bottomHtml)
			

			
		  });
	});
</script>


<script type="text/javascript" charset="utf-8"  src="./L2Dwidget.0.min.js"></script>
<script type="text/javascript" charset="utf-8"  src="./L2Dwidget.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
	    L2Dwidget.init({"display": {
	        "superSample": 2,
	        "width": 200,
	        "height": 400,
	             "position": "right",
	                 "hOffset": 0,
	        "vOffset": 0
	          }
	     });
	});
</script>




<!----------------------------------------------------------->
<!-- waifu-tips.js 依赖 JQuery 库 -->
<script src="saliya/jquery.min.js?v=3.3.1"></script>
<!-- 实现拖动效果，需引入 JQuery UI -->
<script src="saliya/jquery-ui.min.js?v=1.12.1"></script>
<div class="waifu">
  <div class="waifu-tips"></div>
  <canvas id="live2d" class="live2d"></canvas>
  <div class="waifu-tool">
    <span class="fui-home"></span>
    <span class="fui-chat"></span>
    <span class="fui-eye"></span>
    <span class="fui-user"></span>
    <span class="fui-photo"></span>
    <span class="fui-info"></span>
    <span class="fui-cross"></span>
  </div>
</div>


<!-- footer -->
<!-- JS FILES -->
<script src="saliya/waifu-tips.min.js?v=1.4.2"></script>
<script src="saliya/live2d.min.js?v=1.0.5"></script>
<script type="text/javascript">
  var data={
    "waifu": {
      "console_open_msg": ["哈哈，你打开了控制台，是想要看看我的秘密吗？"],
      "copy_message": ["你都复制了些什么呀，转载要记得加上出处哦"],
      "screenshot_message": ["照好了嘛，是不是很可爱呢？"],
      "hidden_message": ["我们还能再见面的吧…"],
      "load_rand_textures": ["我还没有其他衣服呢", "我的新衣服好看嘛"],
      "hour_tips": {
        "t5-7": ["早上好！一日之计在于晨，美好的一天就要开始了"],
        "t7-11": ["上午好！工作顺利嘛，不要久坐，多起来走动走动哦！"],
        "t11-14": ["中午了，工作了一个上午，现在是午餐时间！"],
        "t14-17": ["午后很容易犯困呢，今天的运动目标完成了吗？"],
        "t17-19": ["傍晚了！窗外夕阳的景色很美丽呢，最美不过夕阳红~"],
        "t19-21": ["晚上好，今天过得怎么样？"],
        "t21-23": ["已经这么晚了呀，早点休息吧，晚安~"],
        "t23-5": ["你是夜猫子呀？这么晚还不睡觉，明天起的来嘛"],
        "default": ["嗨~ 快来逗我玩吧！"]
      },
      "referrer_message": {
        "localhost": ["欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "],
        "baidu": ["Hello! 来自 百度搜索 的朋友<br>你是搜索 <span style=\"color:#0099cc;\">", "</span> 找到的我吗？"],
        "so": ["Hello! 来自 360搜索 的朋友<br>你是搜索 <span style=\"color:#0099cc;\">", "</span> 找到的我吗？"],
        "google": ["Hello! 来自 谷歌搜索 的朋友<br>欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "],
        "default": ["Hello! 来自 <span style=\"color:#0099cc;\">", "</span> 的朋友"],
        "none": ["欢迎阅读<span style=\"color:#0099cc;\">『", "』</span>", " - "]
      },
      "referrer_hostname": {
        "example.com": ["示例网站"],
        "www.fghrsh.net": ["FGHRSH 的博客"]
      },
      "model_message": {
        "1": ["来自 Potion Maker 的 Pio 酱 ~"],
        "2": ["来自 Potion Maker 的 Tia 酱 ~"]
      },
      "hitokoto_api_message": {
        "lwl12.com": ["这句一言来自 <span style=\"color:#0099cc;\">『{source}』</span>", "，是 <span style=\"color:#0099cc;\">{creator}</span> 投稿的", "。"],
        "fghrsh.net": ["这句一言出处是 <span style=\"color:#0099cc;\">『{source}』</span>，是 <span style=\"color:#0099cc;\">FGHRSH</span> 在 {date} 收藏的！"],
        "jinrishici.com": ["这句诗词出自 <span style=\"color:#0099cc;\">《{title}》</span>，是 {dynasty}诗人 {author} 创作的！"],
        "hitokoto.cn": ["这句一言来自 <span style=\"color:#0099cc;\">『{source}』</span>，是 <span style=\"color:#0099cc;\">{creator}</span> 在 hitokoto.cn 投稿的。"]
      }
    },
    "mouseover": [
      { "selector": ".container a[href^='http']", "text": ["要看看 <span style=\"color:#0099cc;\">{text}</span> 么？"] },
      { "selector": ".fui-home", "text": ["点击前往首页，想回到上一页可以使用浏览器的后退功能哦"] },
      { "selector": ".fui-chat", "text": ["一言一语，一颦一笑。一字一句，一颗赛艇。"] },
      { "selector": ".fui-eye", "text": ["嗯··· 要切换 看板娘 吗？"] },
      { "selector": ".fui-user", "text": ["喜欢换装 Play 吗？"] },
      { "selector": ".fui-photo", "text": ["要拍张纪念照片吗？"] },
      { "selector": ".fui-info-circle", "text": ["这里有关于我的信息呢"] },
      { "selector": ".fui-cross", "text": ["你不喜欢我了吗..."] },
      { "selector": "#tor_show", "text": ["翻页比较麻烦吗，点击可以显示这篇文章的目录呢"] },
      { "selector": "#comment_go", "text": ["想要去评论些什么吗？"] },
      { "selector": "#night_mode", "text": ["深夜时要爱护眼睛呀"] },
      { "selector": "#qrcode", "text": ["手机扫一下就能继续看，很方便呢"] },
      { "selector": ".comment_reply", "text": ["要吐槽些什么呢"] },
      { "selector": "#back-to-top", "text": ["回到开始的地方吧"] },
      { "selector": "#author", "text": ["该怎么称呼你呢"] },
      { "selector": "#mail", "text": ["留下你的邮箱，不然就是无头像人士了"] },
      { "selector": "#url", "text": ["你的家在哪里呢，好让我去参观参观"] },
      { "selector": "#textarea", "text": ["认真填写哦，垃圾评论是禁止事项"] },
      { "selector": ".OwO-logo", "text": ["要插入一个表情吗"] },
      { "selector": "#csubmit", "text": ["要[提交]^(Commit)了吗，首次评论需要审核，请耐心等待~"] },
      { "selector": ".ImageBox", "text": ["点击图片可以放大呢"] },
      { "selector": "input[name=s]", "text": ["找不到想看的内容？搜索看看吧"] },
      { "selector": ".previous", "text": ["去上一页看看吧"] },
      { "selector": ".next", "text": ["去下一页看看吧"] },
      { "selector": ".dropdown-toggle", "text": ["这里是菜单"] },
      { "selector": "c-player a.play-icon", "text": ["想要听点音乐吗"] },
      { "selector": "c-player div.time", "text": ["在这里可以调整<span style=\"color:#0099cc;\">播放进度</span>呢"] },
      { "selector": "c-player div.volume", "text": ["在这里可以调整<span style=\"color:#0099cc;\">音量</span>呢"] },
      { "selector": "c-player div.list-button", "text": ["<span style=\"color:#0099cc;\">播放列表</span>里都有什么呢"] },
      { "selector": "c-player div.lyric-button", "text": ["有<span style=\"color:#0099cc;\">歌词</span>的话就能跟着一起唱呢"] },
      { "selector": ".waifu #live2d", "text": ["干嘛呢你，快把手拿开", "鼠…鼠标放错地方了！"] }
    ],
    "click": [
      {
        "selector": ".waifu #live2d",
        "text": [
          "是…是不小心碰到了吧",
          "萝莉控是什么呀",
          "你看到我的小熊了吗",
          "再摸的话我可要报警了！⌇●﹏●⌇",
          "110吗，这里有个变态一直在摸我(ó﹏ò｡)"
        ]
      }
    ],
    "seasons": [
      { "date": "01/01", "text": ["<span style=\"color:#0099cc;\">元旦</span>了呢，新的一年又开始了，今年是{year}年~"] },
      { "date": "02/14", "text": ["又是一年<span style=\"color:#0099cc;\">情人节</span>，{year}年找到对象了嘛~"] },
      { "date": "03/08", "text": ["今天是<span style=\"color:#0099cc;\">妇女节</span>！"] },
      { "date": "03/12", "text": ["今天是<span style=\"color:#0099cc;\">植树节</span>，要保护环境呀"] },
      { "date": "04/01", "text": ["悄悄告诉你一个秘密~<span style=\"background-color:#34495e;\">今天是愚人节，不要被骗了哦~</span>"] },
      { "date": "05/01", "text": ["今天是<span style=\"color:#0099cc;\">五一劳动节</span>，计划好假期去哪里了吗~"] },
      { "date": "06/01", "text": ["<span style=\"color:#0099cc;\">儿童节</span>了呢，快活的时光总是短暂，要是永远长不大该多好啊…"] },
      { "date": "08/25", "text": ["<span style=\"color:#0099cc;\">情人节</span>了呢，牛郎织女，许仙白蛇，董永七仙女，告诉我们一个道理，秀恩爱，遭天谴…"] },
      { "date": "09/03", "text": ["<span style=\"color:#0099cc;\">中国人民抗日战争胜利纪念日</span>，铭记历史、缅怀先烈、珍爱和平、开创未来。"] },
      { "date": "09/10", "text": ["<span style=\"color:#0099cc;\">教师节</span>，在学校要给老师问声好呀~"] },
      { "date": "10/01", "text": ["<span style=\"color:#0099cc;\">国庆节</span>，新中国已经成立69年了呢"] },
      { "date": "11/05-11/12", "text": ["今年的<span style=\"color:#0099cc;\">双十一</span>是和谁一起过的呢~"] },
      { "date": "12/20-12/31", "text": ["这几天是<span style=\"color:#0099cc;\">圣诞节</span>，主人肯定又去剁手买买买了~"] }
    ]
  }
  /* 可直接修改部分参数 */
  live2d_settings['modelId'] = 6;                  // 默认模型 ID
  live2d_settings['modelTexturesId'] = 13;         // 默认材质 ID
  live2d_settings['modelStorage'] = false;         // 不储存模型 ID
  live2d_settings['canCloseLive2d'] = true;       // 隐藏 关闭看板娘 按钮
  live2d_settings['canTurnToHomePage'] = false;    // 隐藏 返回首页 按钮
  live2d_settings['waifuSize'] = '400x300';        // 看板娘大小
  live2d_settings['waifuTipsSize'] = '400x100';    // 提示框大小
  live2d_settings['waifuFontSize'] = '20px';       // 提示框字体
  live2d_settings['waifuToolFont'] = '25px';       // 工具栏字体
  live2d_settings['waifuToolLine'] = '50px';       // 工具栏行高
  live2d_settings['waifuToolTop'] = '-60px';       // 工具栏顶部边距
  live2d_settings['waifuDraggable'] = 'axis-x';    // 拖拽样式
  /* 在 initModel 前添加 */
  initModel(data)
</script>
<!----------------------------------------------------------->



</body>
</html>
